<template>
	<view>
		<view class="form">
			<u--form labelPosition="left" ref="uForm">
				<u-form-item label="部门名称" borderBottom ref="item1" labelWidth="200">
					<u--input border="none" v-model="form.name"></u--input>
				</u-form-item>
			</u--form>
			<view class="u-flex a-center">
				<view class="w105">
					部门层级
				</view>
				<view class="text-orange" @click="show=true">
					请选择部门层级
				</view>
				<view>
					<u-action-sheet :actions="list" :title="title" :show="show" :closeOnClickOverlay="true"
						:closeOnClickAction="true" @close="show=false"></u-action-sheet>
				</view>
			</view>
			<view class="u-flex a-center">
				<view class="w105">
					部门主管
				</view>
				<MultipleSelect :selectList="supervisorList" :selectData="selectData" @change="multipleChange"
					@del="delItem">
				</MultipleSelect>
			</view>
		</view>
		<view class="footer pd-10">
			<view class="save-btn" @click="saveBtn">
				保存
			</view>
		</view>
	</view>
</template>

<script>
	import MultipleSelect from '../../pages/components/select/MultipleSelect.vue.vue';
	export default {
		components: {
			MultipleSelect
		},
		data() {
			return {
				form: {
					name: ''
				},
				custAccId:'',
				acId:'',
				title: '部门层级',
				list: [{
						name: '选项一',
					},
					{
						name: '选项一',
					},
					{
						name: '选项一',
					}
				],
				show: false,
				bmId: '',
				selectData:[],
				supervisorList: [],
				saveSupervisorList:[]
			};
		},
		onLoad(e) {
			this.custAccId = uni.getStorageSync('custAccid')
			this.acId = uni.getStorageSync('acId')
			this.bmId = e.id
			this.FindStructureById()
		},
		// 下拉刷新
		onPullDownRefresh() {
			this.getPullRefresh()
		},
		methods: {
			// 下拉刷新请求数据
			getPullRefresh(){
				console.clear()
				
				this.FindStructureById()
				
			},
			// 部门编辑
			async FindStructureById() {
				const res = await uni.$api.authority.FindStructureById({
					id: this.bmId
				})
				console.log(res)
				this.form.name = res.data.structure.stName
				// this.supervisorList=res.data.supervisor
				this.supervisorList = res.data.supervisor.map(i => {
					return {
						label: i.empName,
						value: i.id,
						...i
					}
				})
				this.selectData =  res.data.supervisor.map(i => i.id);
				uni.stopPullDownRefresh()
			},
			multipleChange(val, idx) {
				console.log('选中', val, idx)
				this.saveSupervisorList=val
				this.saveSupervisorList.map((v,i)=>{
						this.saveSupervisorList[i]={
							empId:v,
							struId:51
						}
				})
				console.log(this.saveSupervisorList)
			},
			async saveBtn() {
				let data = {
					structure: {
						id: this.bmId,
						stName: this.form.name,
						stFather: 0
					},
					supervisor:this.saveSupervisorList
				}
				 const res = await uni.$api.authority.UpdateStructure(this.custAccId,this.acId,data)
				 console.log(res,'保存')
			}
		}
	}
</script>

<style lang="scss">
	.form {
		padding-left: 15px;

		.w105 {
			width: 100px;
			padding: 10px 0;
		}
	}

	.footer {
		position: fixed;
		bottom: 0;
		width: 100%;
	}

	.save-btn {
		background-color: #fd7400;
		color: #fff;
		height: 50px;
		font-size: 16px;
		border-radius: 2px;
		line-height: 50px;
		text-align: center;
	}
</style>